<!-- <template>
  <a-result status="500" title="500" sub-title="Sorry, the server is wrong.">
    <template #extra>
      <a-button type="primary">Back Home</a-button>
    </template>
  </a-result>
</template> -->
<template>
  <div id="vditor"></div>
</template>

<script lang="ts" setup>
import { ref, onMounted } from 'vue'
import Vditor from 'vditor'
import 'vditor/dist/index.css'

let vditor = $ref<Vditor | null>(null)

onMounted(() => {
  vditor = new Vditor('vditor', {
    after: () => {
      // vditor.value is a instance of Vditor now and thus can be safely used here
      // vditor.value!.setValue('Vue Composition API + Vditor + TypeScript Minimal Example');
      // console.log(vditor.value);
    },
  })
  // console.log(vditor.value.version)
})
</script>

